<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
    <meta name="apple-mobile-web-app-title" content="标题"> <!-- 添加到主屏后的标题（iOS 6 新增） -->
    <meta name="apple-mobile-web-app-capable" content="yes"><!-- 是否启用 WebApp 全屏模式 -->
    <meta name="apple-mobile-web-app-status-bar-style" content="white-translucent">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <title>试客巴</title>
    <link rel="stylesheet" href="../css/mobile_reset.css">
    <link rel="stylesheet" href="../css/mui.css">
    <link rel="stylesheet" href="../css/personal_center/personal_details.css">
    <script>
        (function () {
            document.addEventListener('DOMContentLoaded', function () {
                var html = document.documentElement;
                var windowWidth = html.clientWidth;
                html.style.fontSize = windowWidth / 7.5 + 'px';
                // 等价于html.style.fontSize = windowWidth / 750 * 100 + 'px';
            }, false);


        })();

        // 这个7.5就是根据设计稿的横向宽度来确定的，假如你的设计稿是640
        // 那么 html.style.fontSize = windowWidth / 6.4 + 'px';
    </script>
</head>
<body>
<!--我的资产-->
    <div class="my_money">
           <div class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
               <div id="mui-scroll" class="mui-scroll">
                   <div class="mui-control-item">
                       <!--可提现本金-->
                        <div class="benjin">
                            <div class="benjin_main">
                                <div class="left left_content">
                                    <p>可提现本金</p>
                                    <p><span><b>0.00</b>元</span></p>
                                </div>
                                <div class="right right_content">本</div>
                            </div>
                            <p>待平台返还本金：<span><b>0.00</b>元(<b>0</b>笔)</span></p>
                        </div>
                    </div>
                   <div class="mui-control-item">
                       <!--夺宝币-->
                      <div class="duobaobi">
                          <div class="benjin_main">
                              <div class="left left_content">
                                  <p>夺宝币</p>
                                  <p><span><b>0</b>个</span></p>
                              </div>
                              <div class="right right_content">宝</div>
                          </div>
                      </div>
                    </div>
                   <div class="mui-control-item">
                       <!--赏金-->
                        <div class="shangjin">
                            <div class="benjin_main">
                                <div class="left left_content">
                                    <p>赏金</p>
                                    <p><span><b>0.00</b>币</span></p>
                                </div>
                                <div class="right right_content">赏</div>
                            </div>
                        </div>
                   </div>
               </div>
           </div>
    </div>
    <div>
        <div class="benjin_content">1</div>
        <div class="duobaobi_content">2</div>
        <div class="shangjin_content">3</div>
    </div>
</body>
<script type="text/javascript" src="../js/jquery-1.10.2.js"></script>
<script type="text/javascript" src="../js/mui.js"></script>
<script type="text/javascript" charset="utf-8">
    //    取消禁止a标签的跳转
    mui('body').on('tap','a',function(){document.location.href=this.href;});
    mui.init({
        gestureConfig:{
            drag: true, //默认为true
        }
    });

    document.getElementById('mui-scroll').addEventListener("drag",function(){
        if( document.getElementById('mui-scroll').style.webkitTransform=='translateX(-10px)'){
            $('.duobaobi_content').css('display','block');
        }
        if( document.getElementById('mui-scroll').style.webkitTransform=='translate3d(-305px ,0px ,0px)'){
            $('.shangjin_content').css('display','block');
        }
            console.log("你正在向左滑动");
        });
</script>
</html>















